<template>
  <div>
    <search-table
      :url="url"
      :requestType="true"
      ref="searchtable"
      :hideSelect="true"
      :columns="columns"
      :form="form"
      style="margin-top:20px;">

      <template slot="searchForm">
        <a-form
          layout="inline"
          :form="form">
          <a-form-item label="文件名称">
            <a-input
              v-decorator="['name']"
              placeholder="请输入文件名称">
            </a-input>
          </a-form-item>

        </a-form>
      </template>

      <template slot="oprationRow">
        <a-button @click="uploadFile"><a-icon type="cloud-upload" />上传文件</a-button>
      </template>
      <template slot="tableOperation" slot-scope="{ record }">

        <a-button type="primary" @click="downLoad(record)" ><a-icon type="download" />下载</a-button>

        <a-divider type="vertical"></a-divider>

        <a-button type="danger" @click="deletes(record)" ><a-icon type="delete" />删除</a-button>

      </template>

    </search-table>
    <uploadFileModal v-if="visible" :visible="visible" :title="title" @cancel="cancelModal" @confirm="confirmModal"></uploadFileModal>
  </div>
</template>

<script>
  import uploadFileModal from './components/uploadFileModal'
  import SearchTable from '../../componentswf/searchTable'
  import domain from '../../../domain.js'
  const base = domain.target
  export default {
    name: 'SelfDefindedCode',
    components: {
      SearchTable,
      uploadFileModal
    },
    created () {

    },
    data () {
      return {

        title: '',
        visible: false,
        // url: 'goldenhome/member/admin_/benefits/card/page',
        // url: '/api/document/searchFileList',
        url: `${base}/document/searchFileList`,
        form: this.$form.createForm(this, { name: 'table_search' }),
        columns: [
          {
            title: '文件名称',
            dataIndex: 'name',
            key: 'name'
            // align: 'center',
            /* customRender:(text,row)=>{
              return <div class="product_td"><table-img src={row.goodsPicture}/><div class="product_name">{text}</div></div>
            } */
          },
          {
            title: '创建时间',
            dataIndex: 'timecreate',
            key: 'timecreate'
          },
          {
            title: '创建人',
            dataIndex: 'usercreate',
            key: 'usercreate'
          },

          {
            title: '操作',
            dataIndex: 'operation',
            key: 'operation',
            scopedSlots: { customRender: 'operation' }
          }
        ]

      }
    },
    methods: {
      cancelModal () {
        this.visible = false
      },
      confirmModal (form) {
        // 正式发上传文件的请求
        // /document/uploadFile
        const url = `${base}/document/uploadFile`
       /* let params ={
          urlId:form.platFormId,
        } */
        console.log('最终获取的表单信息', form) // content-type:"multipart/formData"
        const formData = new FormData()
        formData.append('urlId', form.platFormId)
        formData.append('file', form.file)

        this.$post(url, formData, {}, 2).then((res) => { //
          this.visible = false
          this.$refs.searchtable.handleSearch()
        })
      },
      uploadFile () {
        this.title = '上传文件'
        this.visible = true
      },

      downLoad (record) {
        console.log(record)
        // window.open(record.fileurl)

        const a = document.createElement('a')
        a.setAttribute('href', record.fileurl)
        a.setAttribute('target', '_blank')
        document.body.appendChild(a)
        a.click()
        // document.removeChild(a)
        // this.$router.push({
        //   name: '',
        //   query: {
        //
        //   }
        // })
      },

      addGoods () {
        // 跳到添加商品页面
        this.$router.push({
          name: 'MarketingSelfCreateGoodPagesAddGoods'
        })
      },

      deletes (record) {
        // this.$set(this,"name","wf");  这是不允许的
        console.log('删除', record)
        this.$confirm({
          title: '显示提示',
          content: `删除该文件吗?`,
          okText: '确认',
          cancelText: '取消',
          onOk: () => {
            // this.$post('goldenhome/gh/lottery_/admin/self/buildgoods/delete',{id:record.id}).then(res => {
            //   if (res && res.returnCode == 1000) {
            //     if (res && res.returnCode === 1000) {
            //       this.$message.success('操作成功!')
            //       this.$refs.searchtable.refreshTable()
            //     }
            //   }
            // })
          }
        })
      }
    }
  }

</script>

<style scoped lang="less">

  .product_td{
    display: flex;
    align-items: center;
    .product_name{
      margin-left:6px;
    }
  }
</style>
